import React from 'react'
import { PageHeader,Button,Modal } from 'antd';

import './test.css'
/**
 * 五子棋盘控制组件
 */
export default class Control extends React.Component {
    handleReset(){
        Modal.confirm({
            content:'您确定要重新开始吗?,您的操作将不可逆',
            okText:"确定",
            okType: 'danger',
            cancelText: "取消",
            onOk:()=>{
                this.props.onReset();
            }
        })
    }

    handleRegret(){
        Modal.confirm({
            content:'您确定要悔棋吗',
            okText:"确定",
            okType: 'danger',
            cancelText: "取消",
            onOk:()=>{
                this.props.onRegret();
            }
        })
    }

    render() {
        const extra = (
            <div>
                <Button type="primary" style={{marginRight:'10px'}} onClick={this.handleReset.bind(this)}>重新开始</Button>
                <Button onClick={this.handleRegret.bind(this)}>悔棋</Button>
            </div>
        )

        return (
            <div style={{ background: 'white' }}>
                <PageHeader
                    title="五子棋"
                    subTitle="react 五子棋"
                    extra={extra}
                />
            </div>
        );
    }
}
